import React, { PureComponent } from 'react';
import { Form, Button, Modal, Row, Col, message, Upload } from 'antd';
import { baseurl } from '@/services/baseurl'
import { uploadingSynthesize } from '@/services/peoples'
import ExportJsonExcel from 'js-export-excel'
import { formatDuring } from '@/utils/utils'
class AddModal extends PureComponent<any, any> {
    constructor(props: any) {
        super(props)
        this.state = {
            fileList: []
        }
    }

    changeFile = (info: any, name: string) => {
        let fileList = [...info.fileList];
        fileList = fileList.slice(-1);
        fileList = fileList.map(file => {
            if (file.response) {
                file.url = file.response.url;
            }
            return file;
        });
        this.setState({ [name]: fileList });
    };
    submitHandle = () => {
        const { fileList } = this.state;
        if (!fileList[0]) {
            return message.error('请上传文件')
        }
        uploadingSynthesize({ doc: fileList[0].originFileObj }).then(res => {
            Modal.confirm({
                title: "提示", content: '立即导出人员时长列表？', onOk: () => {
                    let dataTable:any = [];
                    let option = {
                        fileName: '人员学习时长', datas: [
                            {
                                sheetData: dataTable,
                                sheetName: 'sheet',
                                sheetFilter: ['姓名', '身份证号', '学习时长'],
                                sheetHeader: ['姓名', '身份证号', '学习时长'],
                            }]
                    };
                    if (res.length > 0) {
                        if (res) {
                            for (let i in res) {
                                let obj = {
                                    '姓名': res[i].name,
                                    '身份证号': res[i].id_number,
                                    '学习时长': formatDuring(res[i].sum_time),
                                }
                                dataTable.push(obj);
                            }
                        }
                    }
                    let toExcel = new ExportJsonExcel(option);
                    toExcel.saveExcel();
                    this.props.onHide()
                }
            })
            
        })
    }
    render() {
        const { onHide, visible } = this.props;
        const { fileList, loading } = this.state;
        return (
            <Modal
                footer={
                    [
                        <Button key="0" onClick={onHide}>取消</Button>,
                        <Button key="1" type="primary" loading={loading} onClick={this.submitHandle}>上传</Button>
                    ]
                }
                visible={visible} onCancel={onHide} title='学员信息上传'>
                <Row>
                    <Col span={24}>
                        <Form>
                            <Form.Item label={'上传用户列表'}>
                                <Upload accept=".xlsx,.xls" name="doc" beforeUpload={() => { return false }} onChange={(info: any) => this.changeFile(info, 'fileList')} fileList={fileList}>
                                    <Button type="primary">上传EXCEL列表</Button>
                                </Upload>
                                <div style={{ marginTop: 20 }}>
                                    {
                                        <a href={baseurl + 'MemberTemplate.xls'}><Button>下载模板</Button></a>
                                    }

                                </div>
                            </Form.Item>
                        </Form>
                    </Col>
                </Row>
            </Modal>
        );
    }
}

export default AddModal;
